<template>
	<div class="container">
		<van-nav-bar
			fixed
			title="登录"
			@click-left="$router.back()"
			left-arrow
		/>

    <div class="logo-txt">
      优点达资讯
    </div>
		<van-form @submit="onSubmit" label-width="50px">
			<van-field
				v-model="mobile"
				name="mobile"
				label="用户名"
				placeholder="请输入手机号"
        left-icon="manager"
				:rules="[{ required: true, message: '请填写用户名' },
				{pattern:/^1[3-9]\d{9}$/,message:'请输入手机号'}]"
			/>
			<van-field
				v-model="password"
				type="password"
				name="password"
				label="密码"
				placeholder="密码"
        left-icon="lock"
				:rules="[{ required: true, message: '请填写密码' },
				{pattern:/^[a-zA-Z0-9_]{1,12}$/,message:'请输入1~12用户名只能包含数字字母'}]"
			/>
			<div style="margin: 16px">
				<van-button round block type="info" native-type="submit"
					>提交</van-button
				>
			</div>
		</van-form>
		<van-row type="flex" justify="end">
			<van-col :span="10">
				<router-link to="/reg">没有账号,立即注册</router-link>
			</van-col>
		</van-row>
	</div>
</template>

<script>
import { login } from "@/api/user"
import { setToken } from "@/utiles/storage"
export default {
	data() {
		return {
			mobile: '',
			password: '',
		}
	},
	methods: {
		async onSubmit(values) {
			const res=await login(values)
			// console.log(res)
			// console.log(res.data.data.token)
			localStorage.setItem('USER_INFO',JSON.stringify(values))
			//获取到token，存储token到本地
			setToken(res.data.data.token)
			if (res.data.errno===0) {
        this.$toast('登录成功')
				this.$router.push('/user')		
			}else if (res.data.errno===1000) {
				this.$toast('密码不正确')
			}
		},
		
	},
}
</script>

<style scoped>
.logo-txt{
  text-align:center;
  font-size: 60px;
  margin: 60px auto;
  color: #1989fa;
}
</style>
